<template>
  <!--人才详情-->
  <view>
    <!-- <baseHead title="人才详情" bg="#ffffff" color="#000000"></baseHead> -->

    <view class="content2" v-if="objectData">
      <view class="banner_item">
        <view class="li-top" :style="{ height: customBarH + 'px' }">
          <view class="li-topImg">
            <view
              class="li-top-image"
              @click="returnClick"
              :style="{ 'margin-top': customBarH - 40 + 'px' }"
            >
              <u-icon name="arrow-left" color="#000000" size="24"></u-icon>
            </view>
            <view
              class="li-top-text"
              :style="{ 'margin-top': customBarH - 40 + 'px' }"
              >简历</view
            >
            <view class="right"></view>
          </view>
        </view>
        <view class="item-li" :style="{ 'margin-top': customBarH + 'px' }">
          <view class="li-right">
            <view class="position">
              <view class="position-left">
                {{ objectData.Name }}
              </view>
              <!-- 		<view class="position-right">
								10~13K
							</view> -->
            </view>
            <view class="information">
              <!-- <span v-for="item in 6">张三<span v-if="item !== 6">丨</span></span> -->
              <!-- <span>{{objectData.Sex == 1 ? '男' : '女'}}</span><span>丨</span> -->
              <span>{{ objectData.Age }}</span>
			  <span>·</span>
              <span v-if="objectData.EducationLevelStr">{{objectData.EducationLevelStr}}</span>
			  <span v-if="objectData.EducationLevelStr">·</span>
              <span v-if="objectData.WorkYear > 0">{{objectData.WorkYear + "年经验"}}</span>
              <span v-if="objectData.WorkYear > 0">·</span>
              <span>{{ objectData.CurrentStatusStr }}</span>
            </view>
            <!-- <view class="text">
							<view style="font-size: 24rpx;" v-if="objectData.Email">
								<span>邮箱：</span><span>{{objectData.Email}}</span>
							</view>
							<view style="font-size: 24rpx;" v-if="objectData.UserPhoneNumber">
								<span>手机：</span><span>{{objectData.UserPhoneNumber}}</span>
							</view>
							<view style="font-size: 24rpx;" v-if="objectData.Address">
								<span>现居地址：</span><span>{{objectData.Address}}</span>
							</view>
						</view> -->
          </view>
          <view class="li-left">
            <view class="top-img">
              <image
                class="img"
                v-if="
                  (objectData.Avatar == '' || objectData.Avatar == null) &&
                  objectData.Sex == 1
                "
                :src="man1"
                mode=""
              ></image>
              <image
                class="img"
                v-else-if="
                  (objectData.Avatar == '' || objectData.Avatar == null) &&
                  objectData.Sex == 2
                "
                :src="woman1"
                mode=""
              ></image>
              <image
                v-else
                class="img"
                :src="URL + objectData.Avatar"
                shape="square"
                :default-url="src"
              >
              </image>
            </view>
            <!-- <view class="bottom-text">{{objectData.CurrentRole == 0 ? '职场人' : '学生'}}</view> -->
          </view>
        </view>
      </view>
      <view class="title">求职意向</view>
      <!-- 简历管理进入详情 -->
      <view v-if="distinguish">
        <view
          class="job-intention1"
          :class="index > 0 ? 'intention-acvive' : ''"
          v-for="(item, index) in objectData.JobExpectList"
          :key="index"
        >
          <view class="intention">
            <view class="intention-top">
              <view>{{ item.PositionName }}</view>
              <view>
                {{
                  item.Negotiable
                    ? "面议"
                    : formatNumber(item.MinWage) +
                      "-" +
                      formatNumber(item.MaxWage)
                }}
              </view>
              <view style="margin-left: -80rpx">{{ item.WorkTypeStr }}</view>
              <view style="margin-left: -100rpx">{{ item.PcaAddress }}</view>
            </view>
            <view class="intention-bottom">
              <view
                class="bottom-li"
                v-for="(item, index) in item.IndustryList"
                :key="index"
              >
                {{ item.Name }}
              </view>
            </view>
          </view>
        </view>
      </view>
      <!-- 首页列表进入详情 -->
      <view v-else>
        <view class="job-intention">
          <view class="intention">
            <view class="intention-top">
              <span>{{ objectData.JobExpect.PositionName }}</span>
              <span>{{
                objectData.JobExpect.Negotiable
                  ? "面议"
                  : formatNumber(objectData.JobExpect.MinWage) +
                    "-" +
                    formatNumber(objectData.JobExpect.MaxWage)
              }}</span>
              <span>{{ objectData.JobExpect.WorkTypeStr }}</span>
              <span>{{ objectData.JobExpect.PcaAddress }}</span>
            </view>
            <view
              class="intention-bottom"
              v-if="
                objectData.JobExpect.IndustryList.length > 0 &&
                objectData.JobExpect.IndustryList[0].Name != ' '
              "
            >
              <view
                class="bottom-li"
                v-for="(item, index) in objectData.JobExpect.IndustryList"
                :key="index"
              >
                {{ item.Name }}
              </view>
            </view>
          </view>
        </view>
      </view>

      <view class="title" v-if="objectData.GoodAt">自我介绍</view>
      <view class="self-introduction" v-if="objectData.GoodAt">
        <view class="introduction">
          {{ objectData.GoodAt }}
        </view>
        <view
          class="left-company"
          v-if="objectData.GoodAtImages !== '' && objectData.GoodAtImages"
        >
          <image
            v-for="(ite, index) in imgList(objectData.GoodAtImages.split(','))"
            :key="index"
            class="logo"
            :src="ite"
            mode="aspectFill"
            @click="
              previewImage(ind, imgList(objectData.GoodAtImages.split(',')))
            "
          >
          </image>
          <view
            class="videoClass"
            @click="gotoVideo(videourl)"
            v-if="objectData.GoodAtVideo"
          >
		  <view class="imageClass"></view>
            <!-- <image
              class="imageClass"
              src="/static/static/images/shipinfengmian.png"
            ></image> -->
            <!-- <image class="top-img" src="/static/static/images/video-file.png"></image> -->
          </view>
        </view>
      </view>
      <view class="title" v-if="objectData.WorkExps.length !== 0"
        >工作/实习经历</view
      >
      <view class="work-experience" v-if="objectData.WorkExps.length !== 0">
        <view
          class="cont-title"
          v-for="(item, index) in objectData.WorkExps"
          :key="index"
        >
          <view class="cont">
            <view class="cont-left">{{ item.CompanyName }}</view>
            <view class="cont-right">
              {{ dateFormat(item.StartDate) + "-" + dateFormat(item.EndDate) }}
            </view>
          </view>
          <view class="contA">
            <span class="cont-text">{{ item.PositionName }}</span>
            <span class="cont-right">{{ "·" + item.Wage / 1000 + "K" }}</span>
          </view>
          <view class="contB">
            <span class="cont-text">职位类别：</span>
            <span class="cont-right">{{ item.PositionName }}</span>
          </view>
          <view class="contC">
            <view class="cont-text" style="white-space: pre-wrap"
              ><span class="xiao-title">工作内容：</span
              >{{ item.WorkContent }}</view
            >
            <!-- <view class="cont-right" style="white-space: pre-wrap;"></view> -->
          </view>
          <view class="cont1" v-if="item.Emphasis !== ' ' && item.Emphasis">
            <view
              class="cont1-li"
              v-for="(ite, index) in item.Emphasis.split(',')"
              :key="index"
              >{{ ite }}
            </view>
          </view>
        </view>
      </view>
      <view class="title" v-if="objectData.EducationExps.length !== 0"
        >教育经历</view
      >
      <view class="educatio" v-if="objectData.EducationExps.length !== 0">
        <view
          class="educatio-ul"
          v-for="(item, index) in objectData.EducationExps"
          :key="index"
        >
          <view class="educatio-li">
            <view class="dic">
              {{ item.SchoolName }}
            </view>
            <view class="dic1">
              {{ dateFormat(item.StartDate) + "-" + dateFormat(item.EndDate) }}
            </view>
          </view>
          <view class="educatio-li">
            <view class="dic2">
              <span>{{ item.EduDegreeStr }}</span
              ><span>{{ item.Major ? "·" + item.Major : "" }}</span>
            </view>
          </view>
        </view>
      </view>
      <view class="title" v-if="objectData.ProjectExps.length !== 0"
        >项目经历</view
      >
      <view class="project" v-if="objectData.ProjectExps.length !== 0">
        <view
          class="project-ul"
          v-for="(item, index) in objectData.ProjectExps"
          :key="index"
        >
          <view class="project-li">
            <view class="li-left">{{ item.ProjectName }}</view>
            <view class="li-right">{{
              dateFormat(item.StartDate) + "-" + dateFormat(item.EndDate)
            }}</view>
          </view>
          <view class="project-liA">
            <span class="li-left">担任角色：</span>
            <span class="li-left">{{ item.RoleName }}</span>
          </view>
          <view class="project-liB">
            <view class="li-right">项目描述：{{ item.Content }}</view>
          </view>
        </view>
      </view>
      <view class="title" v-if="objectData.TrainExps.length !== 0"
        >培训经历</view
      >
      <view class="project" v-if="objectData.TrainExps.length !== 0">
        <view
          class="project-ul"
          v-for="(item, index) in objectData.TrainExps"
          :key="index"
        >
          <view class="project-li">
            <span class="li-left">{{ item.CompanyName }}</span>
            <span class="li-right">{{
              dateFormat(item.StartDate) + "-" + dateFormat(item.EndDate)
            }}</span>
          </view>
          <view class="project-li">
            <!-- <span class="li-left">课程内容：</span> -->
            <span class="li-right">课程内容：{{ item.CourseName }}</span>
          </view>
        </view>
      </view>
      <view class="title" v-if="objectData.LangSkills.length !== 0"
        >语言能力</view
      >
      <view class="language" v-if="objectData.LangSkills.length !== 0">
        <view
          class="language-ul"
          v-for="(item, index) in objectData.LangSkills"
          :key="index"
        >
          <view class="language-li" style="width: 120rpx">
            {{ item.Lang }}
          </view>
          <view class="language-li"> 听写能力{{ item.LsLevelStr }} </view>
          <view class="language-li"> 读写能力{{ item.RwLevelStr }} </view>
        </view>
      </view>
      <view class="title" v-if="objectData.ProSkills.length !== 0"
        >专业技能</view
      >
      <view class="language" v-if="objectData.ProSkills.length !== 0">
        <view
          class="language-ul"
          v-for="(item, index) in objectData.ProSkills"
          :key="index"
        >
          <view class="language-li">
            {{ item.Title }}
          </view>
          <view class="language-li">
            {{ item.Level }}
          </view>
          <view class="language-li">
            <span>使用时长：</span>
            <span>{{ item.UseTime + "个月" }}</span>
          </view>
        </view>
      </view>
      <view class="title" v-if="objectData.Certificates.length !== 0"
        >证书</view
      >
      <view class="language" v-if="objectData.Certificates.length !== 0">
        <view
          class="language-ul"
          v-for="(item, index) in objectData.Certificates"
          :key="index"
        >
          <view class="language-li">
            {{ item.Name }}
          </view>
          <view class="language-li">
            <span>获得时间：</span>
            <span>{{ dateFormat(item.Date, true) }}</span>
          </view>
        </view>
      </view>

      <view class="title" v-if="objectData.Portfolio.length > 0">
        个人作品<!-- ({{ objectData.Portfolio.length }}/10) --></view
      >
      <view class="works" v-if="objectData.Portfolio.length > 0">
        <view
          class="works-ul"
          v-for="(item, index) in objectData.Portfolio"
          :key="index"
        >
          <view class="works-li" v-if="item.WorksName">
            {{ item.WorksName }}
          </view>
          <view class="works-liA">
            <template v-if="item.WorksUrl">
              <span>作品链接：</span>
              <span>{{ item.WorksUrl }}</span>
            </template>
          </view>
          <view
            class="works-liA"
            v-for="(item1, index) in JSON.parse(item.Attachment)"
            :key="index"
          >
            <template v-if="item1.name">
              <span>作品附件：</span>
              <span>{{ item1.name }}</span>
            </template>
          </view>
        </view>
      </view>

      <view style="height: 130rpx"></view>

      <view class="bottom_bar fl-lr-c">
        <view class="but1 fl-lr-c" @click="Interested()">
          <image
            v-if="objectData.IsCollect"
            src="/static/recruit/gxq1.png"
            mode="aspectFill"
          ></image>
          <image
            v-else
            src="/static/recruit/gxq2.png"
            mode="aspectFill"
          ></image>
          感兴趣
        </view>
        <view class="but2 fl-c" @click="clickinterted()">{{
          objectData.HasChat ? "继续沟通" : "立即沟通"
        }}</view>
      </view>

      <u-popup
        backgroundColor="#fff"
        :round="10"
        :show="chooseShow"
        @close="(chooseShow = false), (chooseId = null)"
        @open="chooseOpen"
      >
        <view class="popup">
          <view class="choose-title"> 选择职位 </view>
          <scroll-view class="content_d" scroll-y="true">
            <view
              class="content3"
              v-for="(item, index) in posData"
              :key="index"
              :class="chooseIndex == index ? 'active' : ''"
              @click="chooseClick(item, index)"
            >
              <view class="fl-lr-c">
                <view class="job_name">{{ item.JobName }}</view>
                <view class="wages">
                  {{
                    formatNumber(item.MinWage) +
                    "-" +
                    formatNumber(item.MaxWage)
                  }}
                </view>
              </view>
              <view class="li-yaoqiu">
                <view>
                  {{ item.EducationCn + "/" + item.Experience + "经验" }}
                </view>
                <view>
                  {{ item.PcaAddress }}
                </view>
              </view>
            </view>
          </scroll-view>
          <view class="bottom-right">
            <u-button
              type="primary"
              text="取消"
              @click="(chooseShow = false), (chooseId = null)"
              plain
              style="margin-right: 30rpx"
            ></u-button>
            <u-button
              type="primary"
              :disabled="chooseId == null"
              text="确定"
              @click="determine"
            >
            </u-button>
          </view>
        </view>
      </u-popup>
    </view>
  </view>
</template>

<script>
import baseHead from "@/pages/component/baseHead.vue";
import config from "@/common/api/config.js";
const app = getApp();
export default {
  data() {
    return {
      f_id: 0,
      fabuzhe_id: 0,
      zwData: "",
      userData: "",
      URL: this.$config.domain.staticUrl,
      videourl: null,
      detail: "",
      objectData: "",
      src: "/static/static/images/avatar1_100.png",
      man1: "/static/recruit/index/nan.png",
      woman1: "/static/recruit/index/nv.png",
      show: false,
      postId: null,
      posData: null,
      chooseShow: false,
      chooseIndex: null,
      chooseId: null,
      distinguish: false, //判断是否从简历管理进入的，true 是  false 否
      jobid: "",
    };
  },
  onLoad(o) {
    this.detail = JSON.parse(decodeURIComponent(o.key));
    if (o.id) {
      this.postId = JSON.parse(decodeURIComponent(o.id));
    }
    if (o.distinguish) {
      this.distinguish = true;
      this.jobid = JSON.parse(decodeURIComponent(o.jobId));
    } else {
      this.distinguish = false;
    }
    // this.getdata()
  },
  components: {
    baseHead,
  },
  onShow() {
    this.getdata();
  },
  methods: {
    //视频跳转
    gotoVideo(videourl) {
      let videoUrl = videourl[0].VideoPath;
      uni.navigateTo({
        url:
          "/pages/views/packageA/type-recruit/video/index?item=" +
          JSON.stringify(videoUrl),
      });
    },
    getdata() {
      if (this.distinguish) {
        this.$http.huirc.talentPoolResumeid(this.detail).then((res) => {
          if (res.Success) {
            this.objectData = res.Result;
            if (
              this.objectData.GoodAtVideo !== null &&
              this.objectData.GoodAtVideo !== ""
            ) {
              this.videourl = JSON.parse(this.objectData.GoodAtVideo);
              return;
            }
          }
        });
      } else {
        this.$http.huirc.talentPoolResume(this.detail).then((res) => {
          if (res.Success) {
            this.objectData = res.Result;
            if (
              this.objectData.GoodAtVideo !== null &&
              this.objectData.GoodAtVideo !== ""
            ) {
              this.videourl = JSON.parse(this.objectData.GoodAtVideo);
              return;
            }
          }
        });
      }
    },
    // 数字转K
    formatNumber(num) {
      return num >= 1e3 ? (num / 1e3).toFixed(0) + "k" : num;
    },
    dateFormat(time, r) {
      let year = time.split(" ")[0].split("-")[0];
      let month = time.split(" ")[0].split("-")[1];
      let day = time.split(" ")[0].split("-")[2];
      // 拼接
      // return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
      if (r) {
        return year + "." + month + "." + day;
      } else {
        return year + "." + month;
      }
    },
    imgList(val) {
      return val.map((res) => {
        return `${this.URL}${res}`;
      });
    },
    previewImage(index, item) {
      console.log(item);
      uni.previewImage({
        current: index,
        urls: item,
      });
    },
    open() {},
    Interested() {
      if (this.distinguish) {
        if (this.objectData.IsCollect) {
          this.$http.huirc
            .collectionDel({
              JobExpectId: [this.postId],
            })
            .then((res) => {
              if (res.Success) {
                // this.$util.toast(res.Message)
                this.getdata();
              } else {
                this.$util.toast("取消失败");
                console.log(res);
              }
            });
        } else {
          this.$http.huirc
            .collectionAdd({
              JobExpectId: [this.postId],
            })
            .then((res) => {
              if (res.Success) {
                // this.$util.toast(res.Message)
                this.getdata();
              } else {
                this.$util.toast("感兴趣失败");
              }
            });
        }
      } else {
        if (this.objectData.IsCollect) {
          this.$http.huirc
            .collectionDel({
              JobExpectId: [this.objectData.JobExpectId],
            })
            .then((res) => {
              if (res.Success) {
                this.$util.toast(res.Message);
                this.getdata();
              } else {
                this.$util.toast("取消失败");
                console.log(res);
              }
            });
        } else {
          this.$http.huirc
            .collectionAdd({
              JobExpectId: [this.objectData.JobExpectId],
            })
            .then((res) => {
              if (res.Success) {
                this.$util.toast(res.Message);
                this.getdata();
              } else {
                this.$util.toast("感兴趣失败");
              }
            });
        }
      }
    },
    clickinterted() {
      if (this.postId) {
        this.$http.huirc
          .jobUserRecordup({
            UserId: this.objectData.UserId,
            JobId: this.distinguish ? this.jobid : this.postId,
            HasChat: 1,
            Applyway: 2,
          })
          .then((res) => {
            if (res.Success) {
              // 招聘者-求职 C2C{UserId}
              if (this.objectData.UserId) {
                let id = "C2C" + this.objectData.UserId;
                uni.navigateTo({
                  url: `/pages/views/packageE/type-recruit/TUI-Chat/chat?conversationID=${id}`,
                });
              }
            }
          });
      } else {
        this.getPosData();
      }
    },
    getPosData() {
      this.$http.huirc
        .talentPoolPosition({
          AuditStatus: 1,
          Display: 0,
        })
        .then((res) => {
          if (res.Success) {
            this.posData = res.Result.Items;
            this.chooseShow = true;
          } else {
            console.log(res);
          }
        });
    },
    chooseOpen() {},
    chooseClick(item, index) {
      console.log(item.Id, index);
      this.chooseId = item.Id;
      this.chooseIndex = index;
    },
    determine() {
      this.postId = this.chooseId;
      this.chooseShow = false;
      this.clickinterted();
    },
    returnClick() {
      uni.navigateBack({
        delta: 1,
      });
    },
    // moveHandle: function() {
    // 	// return !this.chooseShow
    // 	return false
    // }
  },
};
</script>



<style lang="scss" scoped>
.content2 {
  width: 100%;
  padding-bottom: constant(safe-area-inset-bottom);
  /* 兼容 iOS < 11.2 */
  padding-bottom: env(safe-area-inset-bottom);
  /* 兼容 iOS >= 11.2 */
  box-sizing: border-box;
  // margin-top: 20rpx;
  background: #ffffff;
  // padding: 30rpx 20rpx;
  // margin-bottom: 20rpx;

  .banner_item {
    height: 100%;
    width: 100%;
    // border-radius: 20rpx;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    // position: relative;

    .li-top {
      position: fixed;
      width: 100%;
      background-color: #ffffff;
      z-index: 9999999999;

      .li-topImg {
        width: 100%;
        height: 100%;
        background-repeat: repeat;
        background-size: 100% 100%;
        background-image: url("/static/recruit/index/sybj.png");
        display: flex;
        justify-content: space-between;

        .li-top-image {
          box-sizing: border-box;
          padding-left: 20rpx;
          width: 30%;
        }

        .li-top-text {
          text-align: center;
          font-size: 40rpx;
          width: 30%;
        }
        .right {
          width: 30%;
        }
      }
    }

    .item-li {
      // padding: 20rpx 30rpx;
      padding-right: 40rpx;
      padding-top: 20rpx;
      display: flex;
      justify-content: left;
      align-items: center;
      background-color: #fff;
      border-bottom: 1rpx solid #e7e7e8;
      padding-bottom: 20rpx;

      .li-left {
        .top-img {
          // position: relative;

          /deep/.img {
            width: 128rpx !important;
            height: 128rpx !important;
            border-radius: 100px !important;

            .u-avatar__image {
              width: 100% !important;
              height: 100% !important;
            }
          }

          // .imgs {
          // 	width: 29rpx;
          // 	height: 29rpx;
          // 	border-radius: 29rpx;
          // 	position: absolute;
          // 	right: -8rpx;
          // 	bottom: -2rpx;
          // }
        }

        .bottom-text {
          width: 108rpx;
          height: 42rpx;
          font-size: 24rpx;
          background: #ffffff;
          color: #666666;
          border-radius: 4rpx 4rpx 4rpx 4rpx;
          opacity: 1;
          border: 1rpx solid #e9e9e9;
          line-height: 42rpx;
          text-align: center;
          margin-top: 24rpx;
        }
      }

      .li-right {
        flex: 1;
        margin-left: 20rpx;
        display: flex;
        flex-direction: column;
        justify-content: center;

        .position {
          display: flex;
          justify-content: left;
          height: 45rpx;

          .position-left {
            font-size: 48rpx;
            font-weight: bold;
            color: #000000;
            line-height: 45rpx;
          }

          // .position-right {
          // 	font-size: 30rpx;
          // 	font-weight: 400;
          // 	color: #F35370;
          // 	line-height: 45rpx;
          // }
        }

        .information {
          height: 33rpx;
          margin: 40rpx 0 25rpx;
          font-size: 30rpx;
          font-weight: 400;
          color: #313131;
          line-height: 33rpx;

          span {
            margin-left: 5rpx;
          }
        }

        .text {
          min-height: 75rpx;
          font-size: 24rpx;
          font-weight: 400;
          color: #000000;
          line-height: 34rpx;
          display: flex;
          flex-direction: column;
          justify-content: left;
          flex-wrap: wrap;
        }
      }
    }
  }

  .title {
    height: 40rpx;
    font-size: 38rpx;
    font-weight: bold;
    color: #000000;
    line-height: 40rpx;
    text-indent: 0.5em;
    // position: relative;
    margin-top: 50rpx;
  }

  .job-intention {
    border-bottom: 1rpx solid #e7e7e8;
    padding-left: 20rpx;

    .intention {
      margin: 30rpx 0 60rpx 0;

      .intention-top {
        height: 38rpx;
        font-size: 28rpx;
        font-weight: bold;
        color: #000000;
        line-height: 38rpx;
        overflow: hidden;

        span:nth-child(n-1) {
          margin-right: 40rpx;
        }
      }

      .intention-bottom {
        margin-top: 30rpx;
        display: flex;
        justify-content: left;
        flex-wrap: wrap;

        .bottom-li {
          height: 50rpx;
          line-height: 50rpx;
          background: #f7f7f7;
          border-radius: 4rpx 4rpx 4rpx 4rpx;
          text-align: center;
          font-size: 26rpx;
          font-weight: 400;
          color: #666666;
          margin: 10rpx;

          margin-left: 0rpx;

          padding: 0 30rpx;
        }
      }
    }
  }

  .job-intention1 {
    border-bottom: 1rpx solid #e7e7e8;
    padding-left: 20rpx;

    .intention {
      margin: 30rpx 0 60rpx 0;

      .intention-top {
        height: 38rpx;
        font-size: 30rpx;
        font-weight: bold;
        color: #000000;
        line-height: 38rpx;
        display: flex;
        flex-wrap: nowrap;

        view {
          flex: 1;
        }
      }

      .intention-bottom {
        margin-top: 30rpx;
        display: flex;
        justify-content: left;
        flex-wrap: wrap;

        .bottom-li {
          // min-width: 130rpx;
          height: 50rpx;
          line-height: 50rpx;
          background: #f7f7f7;
          border-radius: 4rpx 4rpx 4rpx 4rpx;
          text-align: center;
          font-size: 26rpx;
          font-weight: 400;
          color: #666666;
          margin-right: 20rpx;
          padding: 0 30rpx;
        }
      }
    }
  }

  .self-introduction {
    border-bottom: 1rpx solid #e7e7e8;
    padding: 0 20rpx;
    padding-bottom: 60rpx;

    .introduction {
      font-size: 30rpx;
      font-weight: 400;
      color: #313131;
      line-height: 34rpx;
      text-align: justify;
      white-space: pre-line;
      margin-top: 30rpx;
    }

    .left-company {
      margin-top: 30rpx;
      // width: auto;
      // height: auto;
      display: flex;
      flex-wrap: wrap;
      justify-content: left;
      // margin-bottom: 50rpx;

      .logo {
        width: 128rpx;
        height: 128rpx;
        flex-shrink: 0;
        border-radius: 15rpx;
        margin-right: 1%;
      }

      .videoClass {
        width: 128rpx;
        height: 128rpx;
        flex-shrink: 0;
        position: relative;
        border-radius: 15rpx;

        .imageClass {
          width: 100%;
          height: 100%;
		  border-radius: 15rpx;
		  background: url('/static/static/images/shipinfengmian.png') no-repeat center center;
		  background-size: cover;
        }

        .top-img {
          width: 40rpx;
          height: 40rpx;
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
        }
      }
    }

    // .videoClass {
    // 	display: flex;
    // 	justify-content: center;
    // }
  }

  .work-experience {
    padding-bottom: 30rpx;
    border-bottom: 1rpx solid #e7e7e8;

    .cont-title {
      display: flex;
      flex-direction: column;
      justify-content: left;
      // margin-top: 30rpx;
      // margin-bottom: 30rpx;
      // margin-left: 20rpx;
      margin: 30rpx 20rpx 30rpx 20rpx;

      .cont {
        display: flex;
        justify-content: space-between;

        .cont-left {
          font-size: 30rpx;
          font-weight: bold;
          color: #000000;
        }

        .cont-right {
          // margin-right: 72rpx;
          font-size: 28rpx;
          font-weight: 400;
          color: #999999;
        }
      }

      .contA {
        font-size: 28rpx;
        color: #999999;
        font-weight: 400;
      }

      .contB {
        font-size: 28rpx;
        font-weight: 400;
        color: #333333;
        margin: 20rpx 0;
      }

      .contC {
        font-size: 28rpx;
        font-weight: 400;
        color: #333333;
      }

      .cont1 {
        display: flex;
        flex-wrap: wrap;
        justify-content: left;
        margin-top: 15rpx;

        .cont1-li {
          height: 50rpx;
          line-height: 50rpx;
          margin: 10rpx;
          margin-left: 0rpx;
          text-align: center;
          background: #f7f7f7;
          border-radius: 4rpx;
          opacity: 1;
          font-size: 26rpx;
          font-weight: 400;
          color: #666666;

          padding: 0 30rpx;
        }
      }
    }
  }

  .educatio {
    border-bottom: 1rpx solid #e7e7e8;
    padding-bottom: 50rpx;

    .educatio-ul {
      display: flex;
      // flex-wrap: wrap;
      flex-direction: column;
      justify-content: left;
      margin-top: 30rpx;
      margin-left: 20rpx;

      .educatio-li {
        // margin-right: 68rpx;
        display: flex;
        justify-content: space-between;

        .dic {
          font-size: 30rpx;
          font-weight: bold;
          color: #000000;
        }

        .dic1 {
          font-size: 28rpx;
          font-weight: 400;
          color: #999999;
          margin-right: 20rpx;
        }

        .dic2 {
          font-size: 28rpx;
          font-weight: 400;
          color: #999999;
          margin-top: 10rpx;
        }
      }
    }
  }

  .project {
    border-bottom: 1rpx solid #e7e7e8;

    .project-ul {
      margin: 20rpx 20rpx 50rpx 20rpx;

      .project-li {
        margin-top: 6rpx;
        display: flex;
        justify-content: space-between;

        .li-left {
          font-size: 30rpx;
          font-weight: bold;
          color: #000000;
        }

        .li-right {
          font-size: 28rpx;
          font-weight: 400;
          color: #999999;
          // margin-right: 20rpx;
          text-align: justify !important;
          white-space: pre-wrap;
        }
      }

      .project-liA {
        font-size: 28rpx;
        font-weight: 400;
        color: #999999;
      }

      .project-liB {
        margin-top: 20rpx;
        font-size: 28rpx;
        font-weight: 400;
        color: #333333;
      }
    }
  }

  .training {
  }

  .language {
    margin-top: 16rpx;
    padding-bottom: 50rpx;
    border-bottom: 1rpx solid #e7e7e8;

    .language-ul {
      margin-left: 20rpx;
      display: flex;
      justify-content: space-between;

      .language-li {
        font-size: 30rpx;
        font-weight: 500;
        color: #000000;
        margin-right: 40rpx;
      }
    }
  }

  .works {
    margin-top: 16rpx;

    .works-ul {
      margin-top: 10rpx;
      margin-left: 20rpx;

      .works-li {
        height: 41rpx;
        line-height: 41rpx;
        font-size: 30rpx;
        font-weight: 500;
        color: #000000;
      }

      .works-liA {
        margin-top: 10rpx;
        font-size: 28rpx;
        font-weight: 400;
        color: #3476fe;
      }
    }
  }

  .bottom_bar {
    width: 100%;
    display: flex;
    padding: 20rpx 40rpx;
    box-sizing: border-box;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #fff;

    .but1 {
      background: #ffffff;
      border: 1rpx solid #1684fc;
      border-radius: 10rpx;
      width: 210rpx;
      height: 88rpx;
      font-size: 30rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: #1684fc;
      padding: 26rpx;
      box-sizing: border-box;

      image {
        width: 36rpx;
        height: 36rpx;
      }
    }

    .but2 {
      width: 450rpx;
      height: 88rpx;
      background: #1684fc;
      border-radius: 10rpx;
      font-size: 30rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: #ffffff;
    }
  }

  .u-popup__content {
    width: 90%;

    .choose-title {
      text-align: center;
      height: 40rpx;
      font-size: 38rpx;
      font-weight: bold;
      color: #000000;
      line-height: 40rpx;
      margin-bottom: 20rpx;
    }

    .choose-content {
      padding: 0 30rpx;
      margin: 30rpx 0;
      height: 500rpx;
      overflow-y: auto;

      .choose-ul {
        // width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;

        .choose-li {
          width: 40%;
          // height: 100rpx;
          padding: 15rpx;
          border: 1px solid #eef0f3;
          margin-bottom: 20rpx;

          .li-name {
            font-size: 38rpx;
            font-weight: bold;
            color: #000000;
          }

          .li-mayo {
            font-size: 28rpx;
            font-weight: 400;
            color: #000000;
            margin-top: 10rpx;
          }

          .li-yaoqiu {
            font-size: 26rpx;
            font-weight: 400;
            color: #666666;
            margin-top: 10rpx;
          }
        }

        .active {
          border-color: #338fff !important;
        }
      }
    }

    .bottom-right {
      margin-top: 20rpx;
      display: flex;

      .u-button {
        // width: 150rpx;
      }
    }
  }

  // 弹框
  .popup {
    padding: 40rpx 20rpx;
    width: 100%;
    display: flex;
    flex-direction: column;
    height: 1000rpx;
    overflow: hidden;
    box-sizing: border-box;

    .choose-title {
      text-align: center;
      height: 40rpx;
      font-size: 38rpx;
      font-weight: bold;
      color: #000000;
      line-height: 40rpx;
      margin-bottom: 20rpx;
    }

    .content_d {
      width: 100%;
      display: flex;
      flex: 1;
      height: 1px;
      box-sizing: border-box;

      .content3 {
        width: 100%;
        //margin-top: 20rpx;
        background-color: #fff;
        padding: 20rpx 20rpx 20rpx;
        box-sizing: border-box;
        // border-bottom: 1px solid #dee5ef;
        border: 1px solid #dee5ef;
        margin-top: 20rpx;

        view {
          .job_name {
            font-size: 32rpx;
            font-family: PingFang SC;
            font-weight: bold;
            color: #000000;
            width: auto;
          }

          .wages {
            font-size: 30rpx;
            font-family: PingFang SC;
            font-weight: bold;
            color: #f35370;
            width: auto;
          }
        }

        .li-yaoqiu {
          margin-top: 20rpx;
          display: flex;
          justify-content: space-between;
          font-size: small;
          color: #666666;
        }
      }

      .active {
        border-color: #338fff !important;
      }
    }
  }
}
</style>